<script setup lang="ts">
import { useRouter } from 'vue-router'

const router = useRouter()

const to_page=(url:string)=>
{
    router.push(url);
}

</script>

<template>
    <el-menu 
        mode="horizontal"
        background-color="#545c64"
        text-color="#fff"
    >
        <div class="el-menu-item logo plain">量赢科技</div>
        <el-menu-item @click="to_page('/strategy')">
            <span>策略管理</span>
        </el-menu-item>
        <el-menu-item @click="to_page('/order')">
            <span>委托下单</span>
        </el-menu-item>
        <el-menu-item>
            <span>默认设置</span>
        </el-menu-item>
        <div class="el-menu-item item-right plain">当前交易日: &nbsp; <el-button >退出</el-button></div>
    </el-menu>
</template>

<style scoped lang="scss">
.plain:hover {
    cursor: default;
    background: var(--el-menu-bg-color)!important;
}
.logo {
    font-size: large;
    font-weight: bold;
    cursor: default;
}

.el-menu--horizontal {
    border-radius: var(--el-border-radius-base);
    align-items: center;
    .is-active:nth-child(1) {
        border-bottom-left-radius: var(--el-border-radius-base);
    }
    .el-menu-item {
        line-height: calc(var(--el-menu-item-height) / 5 * 4);
    }
    .item-right {
        margin-left: auto;
    }
}

</style>
